<!DOCTYPE html>
<html lang="zh-CN">
  <head>
    <meta charset="UTF-8" />
    <meta name="viewport" content="width=device-width,initial-scale=1.0,maximum-scale=1.0,minimum-scale=1.0,user-scalable=no">
    <title>倒计时程序</title>
    <style>
      html{overflow-y:hidden;}
	  #copyright {
            position: fixed;
			bottom: 0;
			left: 0;
			font-size: inherit;
			width: 100%;
			color: #ffffff0a;
			overflow: hidden;
			padding: 10px;
        }
    </style>
    <link type="image/x-icon" rel="shortcut icon" href="favicon.ico" />
    <link rel="stylesheet" href="css/font-awesome.min.css" />
	<link rel="stylesheet" href="https://gitee.com/jackshun007/yj/raw/master/css/base.css" />
	<link rel="stylesheet" href="https://gitee.com/jackshun007/yj/raw/master/css/style.css" />
  </head>

  <body>
	<video id="bgVideo" muted autoplay >
		<source id="videoSource" src="" type="video/mp4">
		Your browser does not support the video tag.
	</video>
	
    <div class="bgRed boder-style-15 box" >
		<span id="intText" style="font-size:80px;color:#F2D694;line-height: 150px;">🏝️ 海 啸 造 浪 倒 计 时 🏝️</span>
		<div class="date" style="font-size:35px;color: #20ebe2;position:absolute;top: 20px;right:0;margin: 20px;">
			<span id="dateLine1"></span><br>
			<span id="dateLine2" style="margin: 10px;"></span>
		</div>
		
		<div class="loader">
			<span></span>
			<span></span>
			<span></span>
			<span></span>
		</div>

	</div>
    <div class="build"></div>

    <div class="container">
		<div class="marquee-container">
		  <div class="marquee">
			<!-- 周一/周二 -->
			<!-- <span>【第一场】 11:30 电音海啸派对</span>
			<span>【第二场】 11:45 小丑秀-爵士舞-佤族草裙-印度、狩猎舞-集体舞</span>
			<span>【第三场】 13:30 电音海啸派对</span>
			<span>【第四场】 14:30 小丑秀-爵士舞-佤族草裙-印度、狩猎舞-集体舞</span>
			<span>【第五场】 15:30 电音海啸派对</span>
			<span>【第六场】 17:30 电音海啸派对</span>
			<span>【第七场】 19:30 电音海啸派对</span>
			<span>【第八场】 19:45 夜场开始</span>
			<span>【第九场】 20:40 篝火晚会🔥更衣室门口🔥</span>  -->
			
			<!-- 周三/周末 -->
			<span>【第一场】 11:30 🎵电音海啸派对🎵</span>
			<span>【第二场】 13:30 🎵电音海啸派对🎵</span>
			<span>【第三场】 14:30 🍁黄金海岸佤族专场🍁</span>
			<span>【第四场】 15:30 🎵电音海啸派对🎵</span>
			<span>【第五场】 15:50 ️🚩加勒比快闪️🚩</span>
			<span>【第六场】 17:30 🎵电音海啸派对🎵</span>
			<span>【第七场】 18:00 🚩野人部落快闪/室内馆快闪🚩</span>
			<span>【第八场】 19:30 🎵电音海啸派对🎵</span>
			<span>【第九场】 19:45 🔥🌹夜场开始🌹🔥</span>
			<span>【第十场】 20:40 🔥篝火晚会🚩更衣室门口🔥</span> 
			
			<!-- 七夕专场 -->
			<!-- <span>【第一场】 11:30 🎵电音海啸派对🎵</span>
			<span>【第二场】 11:50 ♨️持久“热”力赛💦</span>
			<span>【第三场】 13:30 🎵电音海啸派对🎵</span>
			<span>【第四场】 13:50 💝齐心协力💞</span>
			<span>【第五场】 14:30 🍁黄金海岸佤族专场🍁</span>
			<span>【第六场】 15:30 🎵电音海啸派对🎵</span>
			<span>【第七场】 15:50 ️🚩加勒比快闪️🚩</span>
			<span>【第八场】 16:30 ️❣️水球大战️🚩更衣室门口❣️</span>
			<span>【第九场】 17:30 🎵电音海啸派对🎵</span>
			<span>【第十场】 17:50 👩🏻‍❤️‍💋‍👨🏻‍水上接吻大赛💋</span>
			<span>【第十一场】 18:00 🚩野人部落快闪/室内馆快闪🚩</span>
			<span>【第十二场】 19:30 🎵电音海啸派对🎵</span>
			<span>【第十三场】 19:50 🌊🌹飞人演出🌹🌊</span>
			<span>【第十四场】 20:00 🔥🌹夜场开始🌹🔥</span>
			<span>【第十五场】 20:40 🔥篝火晚会🚩更衣室门口🔥</span> -->
			<!-- 可以继续添加更多的节目 -->
			<!-- 🔥🌈👩🏻‍❤️‍💋‍👨🏻👩🏻‍❤️‍💋👩‍❤️‍💋‍👨👄👀🎋🎈🎍🎊🎀🎁🎖️🏆🎮🎧🧰📌🌻🚨🌊💝💖💗💓💞❣️❤️‍🔥💥👨♨️⛺🏝️🚩🏳️‍🌈🚀🪂🍀🌹🌺🌷🍁🥦🍄🍅🍓🍒🥝🍉🍊🍭📢🎯🛶🎉💧🎼🎵🎶 -->
		  </div>
	    </div>

      <div class="timeArea">
        <h1>🌷剩余时间🌷</h1>
        <div>
          <div class="hours" id="hours">
            <button class="plus"><i class="fa fa-chevron-up fa-4x"></i></button>
            <h3>00</h3>
            <p>时</p>
            <button class="minus"><i class="fa fa-chevron-down fa-4x"></i></button>
          </div>

          <div class="minutes" id="minutes">
            <button class="plus"><i class="fa fa-chevron-up fa-4x"></i></button>
            <h3>00</h3>
            <p>分</p>
            <button class="minus"><i class="fa fa-chevron-down fa-4x"></i></button>
          </div>

          <div class="seconds" id="seconds">
            <button class="plus"><i class="fa fa-chevron-up fa-4x"></i></button>
            <h3>00</h3>
            <p>秒</p>
            <button class="minus"><i class="fa fa-chevron-down fa-4x"></i></button>
          </div>
        </div>
      </div>
      <div class="btnArea">
        <button class="btn" id="word">编辑名称</button>
        <button class="btn" id="time">目标时间</button>
        <!-- <button class="btn" id="addProgram">添加节目</button> -->
        <button class="btn" id="program">显示节目</button>
        <!-- <button class="btn" id="size">字体大小</button> -->
        <button class="btn" id="visibleTime">隐藏计时</button>
        <button class="btn" id="set">开始计时</button>
      </div>

      <div class="controls" id="controls">
        <button id="rewriting"><i class="fa fa-pencil fa-3x"></i></button>
        <button id="pause"><i class="fa fa-pause fa-3x"></i></button>
        <button id="play" style="display: none"><i class="fa fa-play fa-3x"></i></button>
        <button id="reply"><i class="fa fa-refresh fa-3x"></i></button>
      </div>
	  
	  <p id="copyright">【版权声明】本代码由JackShun独立开发，享有完整的知识产权。未经明确书面授权，任何单位或个人不得将本代码用于商业活动。若您希望合法使用本代码，请通过邮箱【jack_a007@126.com】与我联系，获取正式授权。在未获得授权的情况下，请立即删除相关代码。对于未经授权擅自使用、复制、传播或进行商业利用本代码的行为，我将依据《中华人民共和国著作权法》及相关法律法规，追究侵权者的法律责任，以维护自身合法权益。特此声明！</p>
    </div>
	
	<script src="https://gitee.com/jackshun007/yj/raw/master/js/jquery-3.7.1.min.js"></script>
	<script src="https://gitee.com/jackshun007/yj/raw/master/js/zaolang-script.js"></script>
  </body>
</html>
